/*
	* ViewLibroComponent.fx
	 *
	 * Created on 12/05/2009, 18:42:28
	 */

	package webooksfx_desktop.view.components;

import webooksfx.model.Libro;
import javafx.scene.CustomNode;
import javafx.scene.Group;
import javafx.scene.Node;
import javafx.scene.text.Text;
import javafx.scene.text.Font;
import javafx.scene.shape.Rectangle;
import javafx.scene.paint.Color;
import javafx.scene.input.MouseEvent;
import javafx.animation.Timeline;
import javafx.animation.KeyFrame;

/**
 * @author matias
 */
public class ViewLibroComponent extends CustomNode {
	public var libro: Libro = null;
	public var width: Integer = 580;
	public var height: Integer = 30;
	public var y: Integer = 0;

	public var action: function(id_libro : String) : Void;

	var color: Color = Color.BLACK;
	var colorText: Color = Color.WHITE;
	var colorTextHover: Color = Color.GOLD;
	var color_text: Color = colorText;

	var opacity_rectangle: Number = 0.7;
	var timeline: Timeline = Timeline {
		repeatCount: 1
		keyFrames: [
			KeyFrame {
				time: 0s
				values: bind opacity_rectangle => 0.7
			},
			KeyFrame {
				time: 0s
				values: bind color_text => this.colorText
			},
			KeyFrame {
				time: 1s
				values: bind opacity_rectangle => 1
			},
			KeyFrame {
				time: 1s
				values: bind color_text => this.colorTextHover
			}
		]
	}

	public override function create(): Node {
		return Group {
			translateY: bind y
			content: [
				Rectangle {
					width: bind width
					height: bind height
					fill: Color.GRAY
					arcWidth: 9
                    arcHeight: 9
					opacity: 0.6
				},
				Rectangle {
					translateY: 3
					translateX: 3
					width: bind (width - 6),
					height: bind (height - 6),
					fill: bind color
					arcWidth: 9
                    arcHeight: 9
					opacity: bind opacity_rectangle
					onMouseEntered: function( e: MouseEvent ):Void {
						timeline.rate = 1;
						timeline.play();
					}
					onMouseExited: function( e: MouseEvent ):Void {
						timeline.rate = -1;
						timeline.play();
					}
				}
				Group {
					translateX: 10
					translateY: 10
					content: [
						Text {
							font: Font {
								size: 12
							}
							translateY: 10
							fill: bind color_text
							content: libro.getTitulo(80);
						},
						Text {
							font: Font {
								size: 11
							}
							translateY: 25
							fill: bind color_text
							content: "Editorial: {libro.getEditorial(39)} - {libro.getAutores(true, 50)}";
						},
						ShapeButtonTriangleSkin {
							x: 520
							y: 2
							action: function() {
								action(this.libro.id);
							}
						}
					]
				}
			]
		};;
	}
}
